@import "fonts";
@import "mixins";

@import "admin";
@import "battle";
@import "home";
@import "editor";
@import "faq";
@import "footer";
@import "leaderboard";
@import "login";
@import "newbattle";
@import "news";
@import "titlebar";

* {
	box-sizing: border-box;
}

button {
	background: linear-gradient(#FFF, #DDD);
	border-radius: 2px;
	border: 1px solid $accent3;
	color: $accent2;
	cursor: pointer;
	outline: none;
	padding: 3px 12px;
	text-decoration: none;
	letter-spacing: -0.5px;
	word-spacing: 1px;
	text-transform: uppercase;

	font: {
		weight: bold;
	}

	&:focus {
		border: 1px solid $accent2;
	}

	&:hover {
		background: linear-gradient(#DDD, #FFF);
	}

	&:active {
		position: relative;
		top: 1px;
	}
}

fieldset {
	background: $light_bg3;
	border-radius: $module_radius;
	border: 2px solid $accent1;
	padding: 16px;
	text-align: center;

	input {
		background: #FFF;
		width: 100%;
		
		&:focus {
			background: #FFFFDD;
		}
		margin: 2px;
	}

	legend {
		background: $light_bg3;
		padding: {
			left: 8px;
			right: 8px;
			top: 4px;
			bottom: 0px;
		}
		border: {
			top: 2px solid $accent1;
			left: 1px solid $accent1;
			right: 1px solid $accent1;
		}
		border-top-left-radius: $module_radius;
		border-top-right-radius: $module_radius;
	}
}

code {
	font-family: $font_monospace;
}

body {
	background: url('/static/images/background2.png');
	padding: 0px;
	font: {
		family: $font_main;
		size: 15px;
	}
}

#flashes {
	background: #FFFF55;
	border-bottom: 1px dotted #D00;
	border-top: 1px dotted #D00;
	color: #D00; 
	margin:auto;
	margin-bottom: 16px;
	padding: 4px;

	li {
		list-style: none;
		margin-left: 20px;
	}
}

#bodybox {
	background: $light_bg;
	border-bottom-left-radius: $module_radius;
	border-bottom-right-radius: $module_radius;
	color: $main_text;
	font-family: $font_main;
	margin: {
		left: 100px;
		right: 100px;
	}
	padding:  {
		bottom: 10px;
		left: 0px;
		right: 0px;
		top: 40px;
	}

	h1 {
		-moz-box-sizing: border-box;
		background: $light_bg2;
		box-sizing: border-box;
		display: block;
		margin: 0px;
		width: 100%;
		font: {
			family: $font_title;
			size : 40px;
			weight: normal;
		}
		padding:  {
			left: 20px;
			right: 20px;
			top: 5px;
			bottom: 5px;
		}
	}
	
	h2 {
		margin: 0px;
		margin-bottom: 4px;
		font: {
			family: $font_heading;
			size: 20px;
			weight: normal;
		}
	}

	h3 {
		margin: 0px;
		font {
			family: $font_subheading;
			size: 15px;
			weight: normal;
		}
	}

	h4 {
		margin: 0px;
		font: {
			size: 12px;
			weight: normal;
		} 
	}

	p {
		padding: 0px;
		margin:
		{
			bottom: 6px;
			left: 0px;
			right: 0px;
			top: 0px;
		}
	}

	section {
		overflow: hidden;
		margin: {
			bottom: $module_spacing;
			top: $module_spacing;
		}
		padding: {
			left: $module_spacing;
			right: $module_spacing;
		}
	}

	ul.list {
		list-style: none;
		margin: 0px;
		padding: {
			left: 10px;
		}
		
		li: {
			list-style: none;
		}
	}
}

.right {
	float: right;
}

.left {
	float: left;
}

.clear {
	clear: both;
}